{block name=desktopmenu}
{* Define the function *}
{function name=render_list level=0 parenturl="" menu=0}
	{foreach $items as $item}
		{if $level lt 1 && $item.url eq ''}
			<li class="maintitle {if $listing_url eq ''}active{/if}"><a title="{$item.title}" href="/">{$item.title}</a>
			{call name=render_list items=$item.subs level=$level+1 menu=$menu}
		{else}
			<li class="{if count($item.subs) > 0}dropdown{/if} {if $item.selected eq 1}active{/if}"><a title="{$item.title}" {if $item.url|strstr:"http://"}target="_blank"{/if} href="{if $item.url|strstr:"http://"}{$item.url}{else}{$parenturl}/{$item.url}{/if}" >{$item.title}</a>
			{if count($item.subs) > 0}
				<ul class="dropdown-menu">
        	{call name=render_list items=$item.subs level=$level+1 parenturl=$parenturl|cat:"/"|cat:$item.url menu=$menu}
				</ul>
			{/if}
			</li>
		{/if}
	{/foreach}	
{/function}

<div id="top">
	<div class="container">
		<div class="row">
			<div class="col-sm-5">
				<a href="/"><img src="/images/logo.png" alt="" class="img-responsive" id="logotop" /></a>
			</div>
			<div class="col-md-6 col-md-offset-1 col-lg-5 col-lg-offset-2">
				<ul id="topmenu">
					<li id="menu">
						<a href="#">
						<div class="bubble">
							<img src="/images/menu.png" alt="" />
						</div>
						{$lang.menu.menu}
						</a>
					</li>
					<li>
						<a href="/enrol">
						<div class="bubble">
							<img src="/images/enroll.png" alt="" />
						</div>
						{$lang.menu.enrol}
						</a>
					</li> 
					<li class="shopping-cart-menu">
						<a href="/shopping-cart">
						<div class="bubble">
							<img src="/images/cart.png" alt="" />
							<span class="cartitem nav-itemNumber"{if $itemNumber eq 0} style="display:none"{/if}>{$itemNumber}</span>
						</div>
						{$lang.menu.cart}
						</a>
						<div id="shopping-cart-pop" class="hidden-xs" style="display:none;">
				        {include file='popover-shopping-cart.tpl'}
				    </div>
					</li>
					<!-- <li>
						<a href="/login">
						<div class="bubble">
							<img src="/images/login.png" alt="" />
						</div>
						{$lang.menu.login}
						</a>
					</li> -->
					<li>
						<a href="tel:{$PHONE}" class="visible-xs" title="click to call">
							<div class="bubble">
								<img src="/images/call.png" alt="" />
							</div>
							{$lang.menu.call}
						</a>
						<a href="/contact-us" class="hidden-xs">
							<div class="bubble">
								<img src="/images/call.png" alt="" />
							</div>
							{$lang.menu.call}
						</a>
					</li>
					
				</ul>
			</div>
		</div>
	</div>
</div>



<div id="overlay">
	<div class="container">
		<div class="row">
			<div class="hidden-xs col-sm-3 pull-left text-left" id="hometop">
				<a href="/" id="home1"><span class="glyphicon glyphicon-home"></span>
					<div class="small" style="margin-left: 1px">{$lang.menu.home}</div>
				</a>
			</div>
			<div class="col-xs-6 col-sm-3 pull-right text-right" id="closetop">
				<a href="#" id="close"><span class="glyphicon glyphicon-remove"></span>
					<div class="small" style="margin-right: 10px">{$lang.menu.close}</div>
				</a>
			</div>
		</div>
		<div class="row">
			<div class="col-sm-12">
<!-- 			<ul id="overlay-nav">
				<li class="top-nav">
					<ul>
						<li><a class="maintitle visible-xs" href="/">{$lang.menu.home}</a></li>
						<li><div class="maintitle hidden-xs">{$lang.menu.program}<span>+</span></div>
							<ul class="sub-nav" id="menu1">
								<li><a href="/our-program/about">{$lang.menu.about}</a></li>
								<li><a href="/our-program/benefits">{$lang.menu.benefits}</a></li>
								<li><a href="/our-program/sports">{$lang.menu.sports}</a></li>
								<li><a href="/our-program/age-groups">{$lang.menu.age}</a></li>
								<li><a href="/our-program/locations">{$lang.menu.locations}</a></li>
								<li><a href="/our-program/term-dates">{$lang.menu.tdates}</a></li>
								<li><a href="/our-program/partners-and-sponsors">{$lang.menu.p_s}</a></li>
							</ul>
						</li>
					</ul>
				</li>
				<li class="top-nav">
					<ul>
						<li><a class="maintitle" href="/enrol">{$lang.menu.enrol}</a></li>
						<li><a class="maintitle" href="/enrol">{$lang.menu.book}</a></li> 
						{if !$user.id}
							<li><a class="maintitle" href="/login">{$lang.menu.login}</a></li>
						{else}
							<li><a class="maintitle" href="/process/user?logout=true">{$lang.menu.logout}</a></li>
						{/if}	
						<li class="visible-xs"><div class="maintitle">{$lang.menu.program}<span>+</span></div>
							<ul class="sub-nav" id="menu1">
								<li><a href="/our-program/about">{$lang.menu.about}</a></li>
								<li><a href="/our-program/benefits">{$lang.menu.benefits}</a></li>
								<li><a href="/our-program/sports">{$lang.menu.sports}</a></li>
								<li><a href="/our-program/age-groups">{$lang.menu.age}</a></li>
								<li><a href="/our-program/locations">{$lang.menu.locations}</a></li>
								<li><a href="/our-program/term-dates">{$lang.menu.tdates}</a></li>
								<li><a href="/our-program/partners-and-sponsors">{$lang.menu.p_s}</a></li>
							</ul>
						</li>			
					</ul>
				</li>
				<li class="top-nav">
					<ul>
						<li><a class="maintitle" href="/parties-and-events">{$lang.menu.p_e}</a></li>
						<li><a class="maintitle" href="/elc-and-kinder">{$lang.menu.e_k}</a></li>
						<li><div class="maintitle">{$lang.menu.franchises}<span>+</span></div>
							<ul class="sub-nav">
							<li><a href="/franchises/become-a-franchisee">{$lang.menu.bfranchisee}</a></li>
							<li><a href="/franchises/testimonials">{$lang.menu.testimonials}</a></li>
							<li><a href="/franchises/international">{$lang.menu.international}</a></li>
							</ul>
						</li>
						<li><a class="maintitle" href="/products">{$lang.menu.products}</a></li>
						<li><a class="maintitle" href="/contact-us">{$lang.menu.contact}</a></li>					
					</ul>
				</li>
			</ul> -->
				<ul id="overlay-nav">
					<li class="top-nav">
						<ul>
							<li><a class="maintitle visible-xs" href="/">{$lang.menu.home}</a></li>
							{if !$user.id}
							<li><a class="maintitle" href="/login">{$lang.menu.login}</a></li>
							<li><a class="maintitle" href="/login-register">{$lang.menu.register}</a></li>
							{else}
							<li><a class="maintitle" href="/process/user?logout=true">{$lang.menu.logout}</a></li>
							{/if}
						<li>
						</ul>
					</li>
					<li class="top-nav">
						<ul>
							<li><a class="maintitle" href="/our-program/benefits">{$lang.menu.benefits}</a></li>
							<li><a class="maintitle" href="/our-program/sports">{$lang.menu.sports}</a></li>
							<li><a class="maintitle" href="/our-program/age-groups">{$lang.menu.age}</a></li>
							<li><a class="maintitle" href="/our-program/locations">{$lang.menu.locations}</a></li>
							<li><a class="maintitle" href="/our-program/term-dates">{$lang.menu.tdates}</a></li>
							<li><a class="maintitle" href="/our-program/news-list">{$lang.menu.news}</a></li>
							<li><a class="maintitle" href="/franchises/become-a-franchisee">{$lang.menu.bfranchisee}</a></li>
						</ul>
					</li>
					<li class="top-nav">
						<ul>
							<li><a class="maintitle" href="/our-program/about">{$lang.menu.about}</a></li>
							<li><a class="maintitle" href="/contact-us">{$lang.menu.contact}</a></li>
						</ul>
					</li>
				</ul>
			</div>
		</div>
		<div class="row">
			<div class="col-sm-12">
			<ul id="overlay-social">
				{$lang.menu.follow}
				<li id="social-buttons">
				{if $social_links.facebook}<a href="{$social_links.facebook}" target="_blank" title="Follow us on Facebook"><img src="/images/footfb.png" alt="fb" /></a>{/if}
				{if $social_links.instagram}<a href="{$social_links.instagram}" target="_blank" title="Follow us on Instagram"><img src="/images/footig.png" alt="instagram" /></a>{/if}
				{if $social_links.blog}<a href="{$social_links.blog}" target="_blank" title="Our blog"><img src="/images/footblogger.png" alt="blogger" /></a>{/if}
				</li>
			</ul>
			
			<ul class="visible-xs visible-sm" id="privacyxs">
				<li><a href="/privacy-policy">{$lang.menu.privacy}</a></li>
				<li><a href="/terms-and-conditions">{$lang.menu.t_c}</a></li>
				<li><a href="/refund-policy">{$lang.menu.refund}</a></li>
				<li><a href="/delivery-policy">{$lang.menu.delivery}</a></li>
			</ul>
			</div>
		</div>
	</div>
</div>
<div class="cleartop"></div>
{if $user.id}
<div class="member-status-bar">
	<div class="container">
	<div class="row">
    	<div class="col-sm-12 text-right">
        	<h4><a href="/my-account"><span class="glyphicon glyphicon-user"></span> 您好，{$user.gname}</a>&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;<a href="/process/user?logout=true" title="Log out">{$lang.menu.logout}</a></h4>
        </div>
    </div>
    </div>
</div>
{/if}
<!--<div class="row" id="mmout">
	<div class="col-sm-12 collapse navbar-collapse" id="mainmenu">
		<ul id="menu" class="nav navbar-nav">
		 {call name=render_list items=$menuitems}
			<li class="dropdown navbar-right">
			 	<a href="/shopping-cart" class="dropdown-toggle">
			        <span class="glyphicon glyphicon-shopping-cart"></span>
			 		<div style="display:inline;" class="nav-itemNumber">{$itemNumber}</div>
			 		
			 		<div class="badge nav-subtotal" style="display:inline;">${$subtotal|number_format:2:'.':','}</div>
			    </a>
			    <ul class="dropdown-menu" id="shop-cart-btn">
			        {include file='popover-shopping-cart.tpl'}
			    </ul>
			</li>
		{if $user.id}
			<li><a title="My Account" href="/my-account">G'day {$user.gname}</a></li>
			
			<li><a title="Log Out"  href="/process/user?logout=true"><span class="glyphicon glyphicon-log-out"></span><div style="display:inline;">Log Out</div></a></li>
			
		{else}
			<!-- <li><a title="Log In" href="/login">Log In</a></li> 
			<li><a title="Log In" href="/login-register">Log In</a></li>
		{/if}-->
		<!--</ul>
	</div>
</div>
<div id="search" class="pull-right">
	<form accept-charset="UTF-8" action="/search" method="get" onsubmit="nonAplha('#search')" id="search-form" > 
		<input id="searchbox" type="text" name="q" placeholder="Search Product" value="">
	</form>
</div>-->
{/block}


